<template>
    <div>
      <el-row class="lock-btn" style='margin-top:10px'>
        
        <el-input v-model="queryParams.phone" style="width:250px;float: left;margin-left:5px;" clearable placeholder="请输入手机号"></el-input>
  
        <el-button-group style="margin-left:5px;">
          <el-button size="medium" type="primary" @click="queryBtn" round>搜索</el-button>
        </el-button-group>
      </el-row>
      <el-row style="background:#ffffff;padding-bottom: 30px;border-radius: 10px;margin-left: 10px;margin-top: 30px;box-shadow: 1px 1px 10px #d1cdcd;width: 50%;">
  
        <el-col :span="24">
          <el-form ref="" style="background:#ffffff;padding:20px 0px 0px 0px;border-radius: 10px;margin-top:20px;margin-left: 10px;">
            <el-form-item label="userId：" :label-width="labelWidth" prop="freeTime">
              <el-input v-model="userId" style="max-width:300px" disabled></el-input>
            </el-form-item>
          </el-form>
        </el-col>
  
        <el-col :span="24">
          <el-form ref="" style="background:#ffffff;padding:0px 0px 20px 0px;border-radius: 10px;margin-left: 10px;">
            <el-form-item label="余额：" :label-width="labelWidth" prop="freeTime">
              <el-input v-model="amount" style="max-width:200px"></el-input>
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :span="24" style="margin-left: 180px;">
                <el-button size="medium" type="success" effect="dark" @click="check">校对</el-button>
        </el-col>
      </el-row>
  
  
    
  
        <el-row>
        <el-col :span="24">
  
          <el-form ref="" v-if="showtag" style="background:#ffffff;padding: 30px 0px 30px 0px;border-radius: 10px;margin-top:20px;margin-left: 10px;box-shadow: 1px 1px 10px #d1cdcd;width: 50%;">
            <el-row>
            <el-col span="5">
            <el-form-item label="微信支付：" :label-width="labelWidth" prop="freeTime">
              <el-input v-model="WX" style="max-width:200px;min-width:200px;"></el-input>
            </el-form-item>
          </el-col>
          </el-row>
           
          <el-row>
            <el-col span="5">
            <el-form-item label="余额：" :label-width="labelWidth" prop="freeTime">
              <el-input v-model="WALLET" style="max-width:200px;min-width:200px;"></el-input>
            </el-form-item>
          </el-col>
         
          </el-row>
          <el-row>
            <el-col span="5">
            <el-form-item label="退款金额：" :label-width="labelWidth" prop="freeTime">
              <el-input v-model="REFUND" style="max-width:200px;min-width:200px;"></el-input>
            </el-form-item>
          </el-col>
         
          </el-row>
          <el-row>
            <el-col span="5">
            <el-form-item label="消费金额：" :label-width="labelWidth" prop="freeTime">
              <el-input v-model="CONSUME" style="max-width:200px;min-width:200px;"></el-input>
            </el-form-item>
          </el-col>
        
          </el-row>
  
          <el-row>
            <el-col span="5" style="color:blue">
            <el-form-item label="差额：" :label-width="labelWidth" prop="freeTime">
              <el-input v-model="Difference" style="max-width:200px;min-width:200px;"></el-input>
            </el-form-item>
          </el-col>
        
          </el-row>
  
          <template>
            <i v-if="checkShow" style="font-size: 100px;position: absolute;top:136px;left:378px;color: green;" class="el-icon-success"></i>
            <i v-if="checkShow2" style="font-size: 100px;position: absolute;top:136px;left:523px;color: red;" class="el-icon-success"></i>
          </template>
          
          </el-form>
  
         
  
        </el-col>
       </el-row>   
           
  
  </div>
  </template>
  
  <script>
   
  import { getNickName, getTestUserName } from "../../util/auth";
  import { loadAbnormalOrderApi, procRefundApi,loadLcuserwalletApi,loadAbnormalCheckApi,loadAbnormalUpdateApi,lcuserwalletApi,lcuserwalletSearchApi } from "../../api/lcredepositrequest.js";

  
  export default {
    name: "lcredepositrequest",
    data: function () {
      return {
        clientHeight:
          Math.max(
            document.documentElement.scrollHeight,
            document.body.scrollHeight
          ) -
          132 -
          5 +
          10 -
          28,
        labelWidth: "130px",
        loading: false,
        WX:'',
        WALLET:'',
        REFUND:'',
        userId:'',
        amount:'',
        showtag:false,
        checkShow:false,
        checkShow2:false,
        feeForm:{
         
        },
        total: 0,
        multipleSelection: [],
        lcredepositrequests: [],
        form: {
          
        },
        queryParams:{
         
        },
        addDialog:false,
        parkfieldList: [],
        parkfieldId: '',
        status: '',
        Difference:''
      };
    },
    methods: {
     
      check(){
      var _this = this;
      if(_this.userId != null && _this.userId != undefined){
        _this.showtag = true;
      loadAbnormalCheckApi({openId:_this.userId}).then(resp => {
     _this.WX = resp.data.WX,
     _this.WALLET = resp.data.WALLET,
     _this.REFUND = resp.data.REFUND,
     _this.CONSUME = resp.data.CONSUME;

     let Difference = resp.data.WX - resp.data.WALLET - resp.data.REFUND - resp.data.CONSUME;
     _this.Difference = Difference.toFixed(2)

    //  let NumWX = _this.CONSUME + _this.WALLET + _this.REFUND
    console.log(_this.Difference)
    console.log(-0.1 < Number(_this.Difference))

     if((-0.1 < Number(_this.Difference)) && (Number(_this.Difference) < 0.1)){
      _this.checkShow=true;
      _this.checkShow2=false;
     }else{
      _this.checkShow=false;
      _this.checkShow2=true;
     }


      });
     }else{
    alert("请输入手机号获取userId")
    }
    

    },

    queryBtn () {
        let _this = this;
  
        if(_this.queryParams.phone != null && _this.queryParams.phone != undefined && _this.queryParams.phone != ''){
          lcuserwalletApi({phone:_this.queryParams.phone.replace(/\s*/g, "")}).then(resp => {   
          _this.amount = resp.data[0],
          _this.userId = resp.data[2]
        })
        .catch(resp => {
        
            alert("用户不存在，请重新输入手机号！")
          
        })  
      }else{
        alert("请输入手机号")
      }
      }
    },
    computed: {
      userState () {
        return getNickName() === getTestUserName();
      }
    },
    mounted: function () {
      let _this = this;
      this.$nextTick(function () {
        this.loadAbnormalOrder(_this.pageNo, _this.pageSize);
      });
    }
  };
  </script>
  
  <style scoped>
  .page-tool {
    background:#dfeaf9;
  }
  
  .page-tool div {
    text-align: right;
  }
  
  .lock-btn {
    margin-bottom: 5px;
    margin-top: -10px;
  }
  .operateBtn {
    font-size: 18px;
    width: 32px;
    height: 32px;
    padding: 0;
  }
  </style>